/*版心*/
$--typeArea: 1200px;

/* 改变主题色变量 */
$--color-primary: #c00515;

.border--radius {
  border-radius: 4px;
}

.page-enter-active,
.page-leave-active {
  transition: opacity 0.5s;
}

.page-enter,
.page-leave-active {
  opacity: 0;
}

@mixin flexCenter($jc: center, $ai: center, $fd: row) {
  display: flex;
  justify-content: $jc;
  align-items: $ai;
  flex-direction: $fd;
}

@mixin font($size: 14px, $weight: 400, $color: #333, $align: left) {
  font-size: $size;
  font-weight: $weight;
  color: $color;
  text-align: $align;
}

@mixin scroll() {
  /*滚动条凹槽的颜色，还可以设置边框属性 */
  &::-webkit-scrollbar-track-piece {
    background-color: none;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
  }

  /*滚动条的宽度*/
  &::-webkit-scrollbar {
    width: 9px;
  }

  /*滚动条的设置*/
  &::-webkit-scrollbar-thumb {
    background-color: #dddddd;
    background-clip: padding-box;
    -webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;
  }

  /*滚动条鼠标移上去*/
  &::-webkit-scrollbar-thumb:hover {
    background-color: #bbb;
  }
}
